<!DOCTYPE html>
<html>
<meta charset="utf8">
<head>
	<link rel="stylesheet" href="../styles/common.css" type="text/css" />
	<link rel="stylesheet"	href="../styles/redmond/jquery-ui-1.8.6.custom.css" type="text/css" />
	<script src="../lib/jquery-1.4.4.js"></script>
	<script src="../lib/ui/jquery-ui-1.8.6.custom.min.js"></script>
	<script src="../lib/tools.js"></script>
	<script src="../lib/app.js"></script>
	<script src="../lib/sync.js"></script>
	<script>
		//Gets background page of extension.
		var bg = chrome.extension.getBackgroundPage();	
		$(document).ready(function() {
	    	ExtensionController.initExtension();
		});
	</script>
</head>
<body style="width: 450px; min-height: 300px; padding: 10px; margin-right: 20px;">
	<div style="border: 1px solid black">Delicious 0.2 extenstion for Google Chrome.</div>
	<div id="dialog" title="Wrong Input Data">
		<p>Wrong Input Data.</p>
	</div>	
	<!--LOGIN FORM-->
	<div id="login_form">
		<input type="text" name="login" id="login" placeholder="Input Login" />Login</br>
		<input type="password" name="password" id="password" placeholder="Input Password"/>Password</br>
		<a href="#" id="login_button">Login</a>
	</div>
	<!--MAIN APP FORM-->
	<div id="main_form">
		<div id="menu">
			<a href="#" id="logout_button">Logout ( <span id="user_info"></span> )</a> <a href="#" id="debug_button">Debug</a>		
			<div style="clear: both; visibility: hidden">&nbsp;</div>
		</div>
		<div id="content"></div>
	</div>
</body>
</html>